<template>
  <div class="dia-form">
    <el-row :gutter="50">
      <el-form
        ref="elForm"
        :model="formData"
        :rules="rules"
        size="medium"
        label-width="150px"
      >
        <el-col :span="12">
          <el-form-item label="知识名称" prop="field101">
            <el-input
              v-model="formData.field101"
              placeholder="请输入知识名称"
              clearable
              :style="{ width: '100%' }"
            >
            </el-input>
          </el-form-item>
        </el-col>

  <el-col :span="12">
          <el-form-item label="事件名称" prop="field103">
            <el-input
              v-model="formData.field103"
              placeholder="请输入事件名称"
              clearable
              :style="{ width: '100%' }"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="事件分类" prop="field107">
           <el-select v-model="formData.field107" placeholder="请选事件分类" clearable :style="{width: '100%'}">
             <el-option v-for="(item, index) in field107Options" :key="index" :label="item.label"
               :value="item.value" :disabled="item.disabled"></el-option>
           </el-select>
          </el-form-item>

        </el-col>

        <el-col :span="12">
          <el-form-item label="重要程度" prop="field105">
            <el-radio-group v-model="formData.field105" size="medium">
              <el-radio
                v-for="(item, index) in field105Options"
                :key="index"
                :label="item.value"
                :disabled="item.disabled"
              >{{ item.label }}
              </el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>


        <el-col :span="24">
          <el-form-item label="知识描述" prop="field104">
            <el-input type="textarea" placeholder="请输入" v-model="formData.field104"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="事件原因" prop="field104">
            <el-input type="textarea" placeholder="请输入" v-model="formData.field105"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="处置措施" prop="field104">
            <el-input type="textarea"  placeholder="请输入" v-model="formData.field106"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="2">
          <el-form-item label="启用状态" prop="field104">
            <el-switch
              v-model="formData.field107"
            >
            </el-switch>
          </el-form-item>
        </el-col>
      </el-form>
    </el-row>
  </div>
</template>
<script>
import diaf from './diaform.json'

export default {
  components: {},
  props: [],
  data() {
    return {
      formData: {
        field101: undefined,
        field102: undefined,
        field103: undefined,
        field104: undefined,
        field105: undefined,
        field129: undefined,
        field107: undefined,
        field108: undefined,
        field109: undefined,
        field110: undefined,
        field111: undefined,
        field112: undefined,
        field113: undefined,
        field114: undefined,
        field115: undefined,
        field116: undefined,
        field127: undefined,
        field128: undefined
      },
      rules: {
        field102Options: [{
          "label": "用户违规",
          "value": 1
        },{
          "label": "运维异常",
          "value": 2
        },
        {
          "label": "网络攻击",
          "value": 3
        }
        ,{
          "label": "基础设施故障",
          "value": 4
        }],
        field103: [],
        field104: [],
        field105: [
          {
            required: true,
            message: '重要程度不能为空',
            trigger: 'change'
          }
        ],
        field129: [
          {
            required: true,
            message: '请输入单行文本',
            trigger: 'blur'
          }
        ],
        field107: [
          {
            required: true,
            message: '请选择',
            trigger: 'change'
          }
        ],
        field108: [
          {
            required: true,
            message: '请选择',
            trigger: 'change'
          }
        ],
        field109: [
          {
            required: true,
            message: '请选择',
            trigger: 'change'
          }
        ],
        field110: [
          {
            required: true,
            message: '请选择',
            trigger: 'change'
          }
        ],
        field111: [
          {
            multiple: false,
            required: true,
            message: '请选择',
            trigger: 'change'
          }
        ],
        field112: [
          {
            required: true,
            message: '请选择',
            trigger: 'change'
          }
        ],
        field113: [
          {
            required: true,
            message: '请选择',
            trigger: 'change'
          }
        ],
        field114: [
          {
            required: true,
            message: '请选择',
            trigger: 'change'
          }
        ],
        field115: [
          {
            required: true,
            message: '请选择',
            trigger: 'change'
          }
        ],
        field116: [
          {
            required: true,
            message: '请选择行业属性',
            trigger: 'change'
          }
        ],
        field127: [
          {
            required: true,
            message: '请选择',
            trigger: 'change'
          }
        ],
        field128: [
          {
            required: true,
            message: '请选择',
            trigger: 'change'
          }
        ]
      },
      field105Options: [
        {
          label: '高',
          value: 1
        },
        {
          label: '中',
          value: 2
        },
        {
          label: '低',
          value: 2
        }
      ],
      field107Options: [
        {
          "label": "用户违规",
          "value": 1
        },{
          "label": "运维异常",
          "value": 2
        },
        {
          "label": "网络攻击",
          "value": 3
        }
        ,{
          "label": "基础设施故障",
          "value": 4
        }
      ],
      field108Options: [
        {
          label: '用户违规',
          value: 1
        },
        {
          label: '运维异常',
          value: 2
        },
        {
          label: '网络攻击',
          value: 3
        },
        {
          label: '设施设备故障',
          value: 4
        }
      ],
      field109Options: [
        {
          label: '终端',
          value: 1
        },
        {
          label: '网络',
          value: 2
        },
        {
          label: '应用',
          value: 3
        }
      ],
      field110Options: [
        {
          label: '违规',
          value: 1
        },
        {
          label: '攻击',
          value: 2
        },
        {
          label: '异常',
          value: 3
        },
        {
          label: '脆弱',
          value: 4
        },
        {
          label: '不涉及',
          value: 4
        }
      ],
      field111Options: [],
      field112Options: [
        {
          label: '基本保护要求',
          value: 1
        },
        {
          label: '运行安全',
          value: 2
        },
        {
          label: '物理安全',
          value: 3
        },
        {
          label: '信息安全保密',
          value: 4
        }
      ],
      field113Options: [
        {
          label: '物理隔离',
          value: 1
        },
        {
          label: '安全域边界防护',
          value: 2
        },
        {
          label: '运行管理',
          value: 3
        }
      ],
      field114Options: [
        {
          label: '违规行为',
          value: 1
        },
        {
          label: '异常行为',
          value: 2
        },
        {
          label: '一般行为',
          value: 3
        }
      ],
      field115Options: [
        {
          label: '基础网络监管',
          value: 1
        },
        {
          label: '涉密人员监管',
          value: 2
        },
        {
          label: '涉密应用监管',
          value: 3
        },
        {
          label: '涉密主机监管',
          value: 4
        }
      ],
      field116Options: [
        {
          label: '电政保密体系',
          value: 1
        },
        {
          label: '纪委体系',
          value: 2
        },
        {
          label: '公安技侦',
          value: 3
        }
      ],
      field127Options: [
        {
          label: '是',
          value: 1
        },
        {
          label: '否',
          value: 2
        }
      ],
      field128Options: [
        {
          label: '超24小时未处置',
          value: 1
        },
        {
          label: '超7天未处置',
          value: 2
        },
        {
          label: '超1月未处置',
          value: 2
        }
      ]
    }
  },
  computed: {},
  watch: {},
  created() {
  },
  mounted() {
    console.log(diaf)
    this.field111Options = diaf.data.children.map((item, index) => {
      return {
        value: item.tagId,
        label: item.tagName,
        children: this.get111(item.children)
      }
    })
  },
  methods: {
    submitForm() {
      this.$refs['elForm'].validate((valid) => {
        if (!valid) return
        // TODO 提交表单
      })
    },
    resetForm() {
      this.$refs['elForm'].resetFields()
    },
    get111(item, index) {
      if (item) {
        return item.map((item, index) => {
            return {
              value: item.tagId,
              label: item.tagName

            }
          }
        )
      } else {
        return
      }
    }
  }
}
</script>
<style lang="scss" scoped>
</style>
